<template>
    <!-- 表格 -->
    <el-table
      stripe
      :data="datalist"
      highlight-current-row
      @row-click="showDetails"
      row-class-name="link"
      :element-loading-text="$I18n.loading">
       <!-- 站点 -->
      <el-table-column prop="site" :label="$I18n.site"></el-table-column>
      <!-- 服务器名称 -->
      <el-table-column prop="serviceName" :label="$I18n.serviceName"></el-table-column>
      <!-- 服务器登录用户 -->
      <el-table-column prop="serviceUser" :label="$I18n.serviceUser"></el-table-column>
      <!-- 服务器密码 -->
      <el-table-column prop="servicePassword" :label="$I18n.servicePassword"></el-table-column>
      <!-- 虚拟机名称 -->
      <el-table-column prop="virtualName" :label="$I18n.virtualName"></el-table-column>
      <!-- 虚拟机IP -->
      <el-table-column prop="virtualLocalIp" :label="$I18n.virtualLocalIp"></el-table-column>
      <!-- 虚拟机登录用户 -->
      <el-table-column prop="virtualUser" :label="$I18n.virtualUser"></el-table-column>
      <!-- 虚拟机密码 -->
      <el-table-column prop="virtualPassword" :label="$I18n.virtualPassword"></el-table-column>
      <!-- 创建时间 -->
      <el-table-column prop="createdDate" :label="$I18n.createdDate"></el-table-column>
      <!-- 虚拟机状态 -->
      <el-table-column prop="virtualStatus" :label="$I18n.status"></el-table-column>
    </el-table>
</template>

<script>
import INTERFACE from '../interface'
import EventBus from '@/services/eventBus'

export default {
  // tagsInfo：搜索条件，传给后端，获取表格数据
  props: ['tagsInfo'],
  data() {
    return {
      datalist: [],        // 表格数据
      loading: true
    }
  },
  methods: {
    // 查看详情
    showDetails(row, column, event) {
      this.$router.push({
        path: '/virtualUpdate',
        query: {virtualId: row.virtualId}
      })
    }
  },
  mounted() {
  },
  watch: {
    tagsInfo: {
      handler(newValue) {
        // 根据搜索条件获取表格数据
        INTERFACE.getBusinessCheck(this.tagsInfo).then(res => {
          this.datalist = res.data.data || []
          // 通知分页组件总共条数
          EventBus.$emit('pageData', {totalPage: res.data.totalPage, currentPage: res.data.currentPage})
        }).catch(() => {
          this.datalist = []
        })
      },
      deep: true,
      immediate: true
    }
  }
}
</script>
<style lang="stylus">
</style>
